<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../../css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="../../css/detail_common.css">
    <style media="screen">
    		body {
    			position: relative;
    		}
        .mui-content {
            height: inherit;
            background-color: #f2f6f9;
        }
        
        .my-nav {
            background: #498af7;
        }
        
        .my-nav .mui-title,
        a {
            color: #ffffff;
        }
        
        .info-header {
            display: flex;
            flex-wrap: nowrap;
            padding: 10px;
            color: grey;
            overflow: hidden;
        }
        
        .header-text {
            display: flex;
            flex-direction: column;
            margin-left: 15px;
            font-size: 14px;
            justify-content: space-around;
        }
        
        .header-img img {
            width: 100px;
            height: 80px;
            background-size: 100% 100%;
        }
        
        .my-title {
            width: inherit;
            font-weight: 500;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
        }
        
        .jinji-situation {
            color: #ff8a0d;
        }
        
        .jiaji-situation {
            color: red;
        }
        
        .my-cell-row {
            display: flex;
            flex-wrap: nowrap;
            justify-content: space-between;
            font-size: 15px;
        }
        
        .my-cell-cloumn {
            display: flex;
            flex-direction: column;
        }
        
        .my-cell-title {
            font-size: 15px;
            color: #666666;
        }
        
        .my-cell-name {
            line-height: 36px;
        }
        
        .circle-name {
            display: inline-block;
            width: 37px;
            height: 37px;
            text-align: center;
            line-height: 37px;
            color: #498af7;
            font-size: 22px;
            background-color: #dbe6fa;
            border-radius: 50%;
        }
        
        .my-cell-paragraph {
            font-size: 15px;
            color: #333333;
            margin-top: 10px;
            white-space: normal;
            line-height: 24px;
        }
        
        .my-cell-img {
            margin-top: 10px;
            display: flex;
            flex-wrap: wrap;
            justify-content: flex-start;
            align-items: flex-start;
        }
        
        .my-sm-img {
            width: 33%;
            height: 80px;
            background-size: 100% 100%;
            background-color: #fff;
            background-position: 0 0;
        }
        
        .slide-item {
            border: none;
        }
        
        .mui-table-view-cell>a:not(.mui-btn) {
            white-space: normal;
        }
        
        .btn-bottom {
            padding: 10px 10px;
            background-color: #fff;
        }
        
        .my-block-btn {
            margin: 10px auto;
            background-color: #498af7;
            padding: 10px 0;
            font-weight: 300;
            border-radius: 5px;
        }
        .btn-bottom .my-block-btn:first-child {
        		margin-top: 0;
        }
        /*popover*/
        
        .mui-popover {
            height: 300px;
            width: 100%;
            bottom: 0;
        }
        /*图片预览*/
        
        .mui-preview-image.mui-fullscreen {
            position: fixed;
            z-index: 20;
            background-color: #000;
        }
        
        .mui-preview-header,
        .mui-preview-footer {
            position: absolute;
            width: 100%;
            left: 0;
            z-index: 10;
        }
        
        .mui-preview-header {
            height: 44px;
            top: 0;
        }
        
        .mui-preview-footer {
            height: 50px;
            bottom: 0px;
        }
        
        .mui-preview-header .mui-preview-indicator {
            display: block;
            line-height: 25px;
            color: #fff;
            text-align: center;
            margin: 15px auto 4;
            width: 70px;
            background-color: rgba(0, 0, 0, 0.4);
            border-radius: 12px;
            font-size: 16px;
        }
        
        .mui-preview-image {
            display: none;
            -webkit-animation-duration: 0.5s;
            animation-duration: 0.5s;
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
        }
        
        .mui-preview-image.mui-preview-in {
            -webkit-animation-name: fadeIn;
            animation-name: fadeIn;
        }
        
        .mui-preview-image.mui-preview-out {
            background: none;
            -webkit-animation-name: fadeOut;
            animation-name: fadeOut;
        }
        
        .mui-preview-image.mui-preview-out .mui-preview-header,
        .mui-preview-image.mui-preview-out .mui-preview-footer {
            display: none;
        }
        
        .mui-zoom-scroller {
            position: absolute;
            display: -webkit-box;
            display: -webkit-flex;
            display: flex;
            -webkit-box-align: center;
            -webkit-align-items: center;
            align-items: center;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            left: 0;
            right: 0;
            bottom: 0;
            top: 0;
            width: 100%;
            height: 100%;
            margin: 0;
            -webkit-backface-visibility: hidden;
        }
        
        .mui-zoom {
            -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
        }
        
        .mui-slider .mui-slider-group .mui-slider-item img {
            width: auto;
            height: auto;
            max-width: 100%;
            max-height: 100%;
        }
        
        .mui-android-4-1 .mui-slider .mui-slider-group .mui-slider-item img {
            width: 100%;
        }
        
        .mui-android-4-1 .mui-slider.mui-preview-image .mui-slider-group .mui-slider-item {
            display: inline-table;
        }
        
        .mui-android-4-1 .mui-slider.mui-preview-image .mui-zoom-scroller img {
            display: table-cell;
            vertical-align: middle;
        }
        
        .mui-preview-loading {
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            display: none;
        }
        
        .mui-preview-loading.mui-active {
            display: block;
        }
        
        .mui-preview-loading .mui-spinner-white {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-left: -25px;
            margin-top: -25px;
            height: 50px;
            width: 50px;
        }
        
        .mui-preview-image img.mui-transitioning {
            -webkit-transition: -webkit-transform 0.5s ease, opacity 0.5s ease;
            transition: transform 0.5s ease, opacity 0.5s ease;
        }
        
        @-webkit-keyframes fadeIn {
            0% {
                opacity: 0;
            }
            100% {
                opacity: 1;
            }
        }
        
        @keyframes fadeIn {
            0% {
                opacity: 0;
            }
            100% {
                opacity: 1;
            }
        }
        
        @-webkit-keyframes fadeOut {
            0% {
                opacity: 1;
            }
            100% {
                opacity: 0;
            }
        }
        
        @keyframes fadeOut {
            0% {
                opacity: 1;
            }
            100% {
                opacity: 0;
            }
        }
        
        p img {
            max-width: 100%;
            height: auto;
        }
        /*图片预览*/
        
        .my-mui-table-view {
            background-color: #f2f6f9;
        }
        
        .my-cell-row-2 {
            display: flex;
            flex-direction: row;
            justify-content: flex-start;
            flex-wrap: wrap;
        }
        
        .my-reply {
            width: 90%;
            background-color: #ffffff;
            padding: 5px 10px;
            font-size: 15px;
            /*border: 1px solid #bebebe;*/
            margin: 5px 0;
            color: #666666;
            /*border-radius: 5px;*/
        }
        
        .timeline {
            display: inline-block;
            width: 16px;
            height: 16px;
            border-radius: 50%;
            margin-top: 20px;
            margin-right: 10px;
            z-index: 5;
            flex-shrink: 0;
        }
        
        .answer-side {
            background-color: #aa00ff;
        }
        
        .ask-side {
            background-color: #00cc66;
        }
        
        .my-reply-wrapper:before {
            content: '';
            position: absolute;
            top: 55px;
            left: 17px;
            height: 100%;
            width: 1px;
            background-color: #D3DCE6;
        }
        
        .my-cell-time {
            color: #9e9e9e;
            background-color: #f5f5f5;
            font-size: 12px;
            line-height: 16px;
            padding: 0 2px;
            display: inline-block;
        }
        
        .reply-img-wrapper {
            margin-top: 10px;
        }
        
        .icon-font {
            background: url(../../images/drawable-hdpi/time.png) no-repeat;
            display: inline-block;
            width: 12px;
            height: 12px;
            vertical-align: middle;
            margin-top: -2px;
            background-size: cover;
        }
        
        .section-cuidan {
            position: absolute;
            bottom: 0;
            width: 100%;
            background-color: #fff;
            text-align: center;
            z-index: 10;
            padding: 10px;
            overflow: hidden;
            display: none;
            transition: all .5s ease;
        }
        
        .my-title {
            font-size: 18px;
            font-weight: 400;
            padding: 10px 0;
            display: inline-block;
        }
        
        .my-icon img {
            width: 16px;
            height: 16px;
            vertical-align: middle;
            margin-right: 5px;
            margin-top: -2px;
        }
        
        .text-align-right {
        		text-align: right;
        }
        
        .mask {
            height: 100%;
            width: 100%;
            position: absolute;
            top: 0;
            z-index: 9;
            background-color: #000000;
            opacity: 0.4;
            display: none;
            transition: all .5s ease;
        }
        
        .mask-img {
            width: 52px;
            height: 36px;
            background-color: #bebebe;
            margin: 5px;
        }
        
        .mask-img img {
            width: 52px;
            height: 36px;
        }
        
        .webuploader_pick {
            cursor: pointer;
        }
        
        .mui-table-view:before {
            height: 0;
        }
        
        .mui-table-view:after {
            height: 0;
        }
        
        .my-mui-table-view-cell:last-child::after {
            height: 0;
        }
        
        .my-mui-table-view-cell:after {
            height: 0;
        }
        
        .disabled-btn, #btn-refuse.disabled-btn {
        		background-color: #999;
        		border-color: #999;
        }
        .disabled-btn:active {
        		color: #fff;
        }
        
        #btn-accept, #btn-refuse {
        		display: inline-block;
        		width: 47%;
        		margin: 0;
        }
        #btn-refuse {
        		margin-left: 6%;
        		background-color: red;
        		border-color: red;
        }
    </style>
</head>

<body>
    <header class="mui-bar mui-bar-nav my-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">工单详情</h1>
    </header>
    <div class="mui-content">
    </div>

    <div id="section-cuidan" class="section-cuidan">
        <form>
            <span id="section-title" class="my-title"></span>
            <div class="mui-input-row" style="margin: 0 5px;">
                <textarea id="textarea" style="margin-bottom:0;" rows="5" placeholder="把你想要催促的内容描述清楚"></textarea>
            </div>
            <div class="my-cell-row">
                <div class="webuploader_pick text-darkGrey">
                    <i class="my-icon"><img src="../../images/drawable-hdpi/add.png" alt=""></i>
                    <a id="upload-target" class="text-darkGrey">添加图片</a>
                    <!--<input id="fileImage" type="file" size="30" name="fileselect[]" multiple="true" style="display: none;"> 添加图片-->
                </div>
                <div class="text-grey">限200字以内</div>
            </div>
            <div id="preview" class="my-cell-row-2">
                <span class="mask-img temp"></span>
                <span class="mask-img temp"></span>
                <span class="mask-img temp"></span>
            </div>
            <div class="">
                <a href="javascript:void(0);" id="upload-submit" class="my-block-btn mui-btn mui-btn-primary mui-btn-block">发送</a>
            </div>
        </form>
    </div>
    <div id="section-refuse" class="section-cuidan">
        <form>
            <span class="my-title">反馈意见</span>
            <div class="mui-input-row" style="margin: 0 5px;">
                <textarea id="refuse-reason" style="margin-bottom:0;" rows="5" placeholder="把你想要催促的内容描述清楚"></textarea>
            </div>
            <div class="text-align-right text-grey">限200字以内</div>
            <div class="">
                <a href="javascript:void(0);" id="refuse-order-submit" class="my-block-btn mui-btn mui-btn-primary mui-btn-block">发送</a>
            </div>
        </form>
    </div>
    <div id="mask" class="mask">
    </div>
    <!-- <ul class="my-mui-table-view mui-table-view" style="margin-top: 50px;">

		<li class="my-mui-table-view-cell">
			<div class="my-cell-title">工单回复</div>
			<div class="my-reply-wrapper flex-cell-cloumn">
				<div class="my-cell-row-2">
					<div class="timeline answer-side"></div>
					<div class="my-reply">
						<div class="">阿打发我欺负欺负完全阿打发我欺负欺负完全阿打发我欺负欺负完全阿打发我欺负欺负完全</div>

						<div class="slide-box reply-img-wrapper">
							<div class="slide-item">
								<a><img class="my-sm-img" style="width:100%;height:100%;" data-preview-src="" data-preview-group="1" src="../../images/dhImages/shuijiao.jpg" alt=""></a>
							</div>
							<div class="slide-item">
								<a><img class="my-sm-img" style="width:100%;height:100%;" data-preview-src="" data-preview-group="1" src="../../images/dhImages/shuijiao.jpg" alt=""></a>
							</div>
							<div class="slide-item">
								<a><img class="my-sm-img" style="width:100%;height:100%;" data-preview-src="" data-preview-group="1" src="../../images/dhImages/shuijiao.jpg" alt=""></a>
							</div>
						</div>
						<div class="my-cell-time"><i class="icon-font"></i>11:11</div>
					</div>
					</div>
				</div>
				<div class="my-cell-row-2">
					<div class="timeline ask-side"></div>
					<div class="my-reply">
						<div class="">阿打发我欺负欺负完全</div>
						<div class="my-cell-time">11:11</div>
					</div>
				</div>
			</div>
		</li>

	</ul> -->
    <!-- <div id="bottomCuidan"  class="mui-popover mui-popover-bottom">
		<div class="mui-popover-arrow"></div>
		<div class="mui-scroll-wrapper">
			<div class="mui-scroll">
				<ul class="mui-table-view">
					<li class="mui-table-view-cell"><a href="#">Item1</a>
					</li>
					<li class="mui-table-view-cell"><a href="#">Item2</a>
					</li>
					<li class="mui-table-view-cell"><a href="#">Item3</a>
					</li>
					<li class="mui-table-view-cell"><a href="#">Item4</a>
					</li>
				</ul>
			</div>
		</div>

	</div> -->
    <script src="../../js/jquery-2.1.1.min.js"></script>
    <script src="../../js/mui.min.js"></script>
    <script src="../../js/mui.zoom.js"></script>
    <script src="../../js/mui.previewimage.js"></script>
    <script src="../../js/md5.min.js" charset="utf-8"></script>
    <script src="../../js/imgload.js" charset="utf-8"></script>

    <script type="text/javascript">
    		var order;
        mui.init();

        mui('.mui-scroll-wrapper').scroll();

        mui.previewImage(); // 图片单击预览
        (function($) {
            $.plusReady(function() {
            		order = plus.webview.currentWebview().order;
                console.log("js加载成功");
                var types = {};
                types[plus.networkinfo.CONNECTION_UNKNOW] = "网络连接状态未知";
                types[plus.networkinfo.CONNECTION_NONE] = "未连接网络";
                types[plus.networkinfo.CONNECTION_ETHERNET] = "有线网络";
                types[plus.networkinfo.CONNECTION_WIFI] = "WIFI";
                types[plus.networkinfo.CONNECTION_CELL2G] = "2G";
                types[plus.networkinfo.CONNECTION_CELL3G] = "3G";
                types[plus.networkinfo.CONNECTION_CELL4G] = "4G";
                console.log("Network: " + types[plus.networkinfo.getCurrentType()]);
                /*
                	hospitalid 医院id 从用户信息中取
                	departmentid 科室id 从用户信息中取
                	uid 用户id 从用户信息中取
                	oid 工单id
                 */
                var myContent = document.querySelector('.mui-content');
                mui.ajax("https://bird.ioliu.cn/v1?url=http://app.xiaoweicanting.com/hospital.php?m=App&c=orders&a=getOrderInfoById&hospitalid=10&departmentid=11&uid=3&token=dfaf&oid=" + order.id, {
                    dataType: 'json',
                    type: 'get',
                    success: function(data) {
                        console.log(data.data);
                        var orderDetail = data.data;
                        // 默认缩略头像设置
                        var myCell = orderDetail.addname.split("");
                        var myCellNode;
                        if (isChinese(orderDetail.addname)) {
                            myCellNode = myCell[myCell.length - 1];
                        } else {
                            myCellNode = myCell[0].toUpperCase();
                        }
                        console.log(myCellNode);
                        // 详情图片集合
                        var picSet = orderDetail.pics;
                        var imgHTML = '';
                        for (var i = 0; i < picSet.length; i++) {
                            imgHTML += "<div class=\"slide-item\"><a><img class=\"my-sm-img\" data-preview-src=\"http://app.xiaoweicanting.com/" + picSet[i] + "\" data-preview-group=\"1\" style=\"height: 100%; width: 100%;\" src=\"../../images/test/timg.jpeg\" data-src=\"http://app.xiaoweicanting.com/" + picSet[i] + " \" alt=\"\" onload=\"load(this)\"></a></div>"
                        }
                        imgHTML = "<div  class=\"slide-box\">" + imgHTML + "</div>";
                        // 加急标志设置 faultlevel 1->加急 2->紧急 3->超急
                        var faultlevel = "";
                        var faultClass = "";
                        if (orderDetail.faultlevel == 1) {
                            faultlevel = "加急";
                            faultClass = "jiaji-situation";
                        } else if (orderDetail.faultlevel == 2) {
                            faultlevel = "紧急";
                            faultClass = "jinji-situation";
                        } else if (orderDetail.faultlevel == 3) {
                            faultlevel = "超急";
                            faultClass = "jinji-situation";
                        }
                        /*
                        故障状态标志-state:
                        1-> 待处理
                        2-> 处理中
                        3-> 待反馈
                        4-> 待确认
                        */
                        var state = "";
                        if (orderDetail.state == 1) {
                            state = "待处理"
                        } else if (orderDetail.state == 2) {
                            state = "处理中"
                        } else if (orderDetail.state == 3) {
                            state = "待反馈"
                        } else if (orderDetail.state == 4) {
                            state = "待确认"
                        }
                        var content = document.createElement("div");
                        content.innerHTML = "<!-- 头部信息 --><div class=\"info-header\"><div class=\"header-img\"><img src=\"../../images/test/timg.jpeg\" data-src=\"http://app.xiaoweicanting.com/" + orderDetail.equipmentpic + "\" onload=\"load(this)\" alt=\"\"></div><div class=\"header-text\"><div class=\"my-title\">" +
                            orderDetail.equipmentname + "</div><div class=\"my-subTitle\">编号: " + orderDetail.equipmentid + "</div><div class=\"my-subTitle\">工单等级: <span class=\" " + faultClass + "\">" + faultlevel +
                            "</span></div></div></div><!-- 中部列表信息 --><div class=\"info-main\"><ul class=\"mui-table-view\"><li class=\"mui-table-view-cell\"><a><div class=\"my-cell-row\"><div class=\"my-cell-title\"> <span class=\"circle-name\">" + myCellNode +
                            "</span> " + orderDetail.addname + "</div><div class=\"my-cell-name\">" + orderDetail.departmentname + "" + orderDetail.addurole +
                            "</div></div></a>  </li><li class=\"mui-table-view-cell\"><a><div class=\"my-cell-row\"><div class=\"my-cell-title\">提交时间</div><div>" + orderDetail.addtime +
                            "</div></div></a></li><li class=\"mui-table-view-cell\"><a><div class=\"my-cell-row\"><div class=\"my-cell-title\">故障状态</div><div>" + state +
                            "</div></div></a></li><li class=\"mui-table-view-cell\"><a>        <div class=\"my-cell-row\">          <div class=\"my-cell-title\">故障原因</div>          <div>" + orderDetail.reason +
                            "</div></div></a></li><li class=\"mui-table-view-cell\"><a><div class=\"my-cell-cloumn\"><div class=\"my-cell-title\">故障描述</div><div class=\"my-cell-paragraph\">" + orderDetail.content +
                            "</div></div>    </a></li><li class=\"my-mui-table-view-cell\"><a><div class=\"my-cell-cloumn\">    <div class=\"my-cell-title\">故障图片</div><div class=\"my-cell-img\">" + imgHTML +
                            "</div></div></a></li></ul></div>";


                        myContent.appendChild(content);

                        // 工单回复，催单
                        mui.ajax("https://bird.ioliu.cn/v1?url=http://app.xiaoweicanting.com/hospital.php?m=App&c=orders&a=getReplyListByOrderId&hospitalid=10&departmentid=11&uid=3&token=dfaf&orderid=" + order.id, {
                            dataType: 'json',
                            type: 'get',
                            success: function(data) {
                                var replyList = data.data;
                                console.log(replyList);
                                if (replyList.length > 0) {
                                    var i_HTML = '';
                                    for (var i = 0; i < replyList.length; i++) {

                                        var character = replyList[i].state == 1 ? "answer-side" : "ask-side";
                                        // 详情图片集合
                                        var picSet, imgHTML;
                                        if (replyList[i].hasPic == 1) {
                                            picSet = replyList[i].pics;
                                            imgHTML = '';
                                            for (var j = 0; j < picSet.length; j++) {
                                                imgHTML += "<div class=\"slide-item\"><a><img class=\"my-sm-img\" data-preview-src=\"http://app.xiaoweicanting.com/" + picSet[j] + "\" data-preview-group=\"1\" style=\"height: 100%; width: 100%;\" src=\"../../images/test/timg.jpeg\"  data-src=\"http://app.xiaoweicanting.com/" + picSet[j] + " \"  alt=\"\" onload=\"load(this)\"></a></div>"
                                            }
                                            imgHTML = "<div class=\"slide-box\">" + imgHTML + "</div>";

                                        } else {
                                            picSet = '';
                                            imgHTML = '';
                                        }

                                        i_HTML += "<div class=\"my-cell-row-2\"><div class=\"timeline " + character + "\"></div><div class=\"my-reply\"><div class=\"\">" + replyList[i].content + "</div>" + imgHTML + "<div class=\"my-cell-time\"><i class=\"icon-font\"></i>" + replyList[i].addtime + "</div></div></div>";

                                    }
                                    i_HTML = "<li class=\"my-mui-table-view-cell\"><div class=\"my-cell-title\">工单回复</div><div class=\"my-reply-wrapper flex-cell-cloumn\">" + i_HTML + "</div></li><!-- 按钮组 --><div class=\"btn-bottom\"><a href=\"#bottomCuidan\" id=\"btn-cuidan\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block\">催单</a><a href=\"#bottomHuifu\" id=\"btn-huifu\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block\">回复</a>";
                                    i_HTML += "<a href=\"javascript:void(0);\" id=\"btn-fenpei\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block" + (order.state > 1 ? " disabled-btn\">已分配" : "\">分配任务") + "</a>";
                                    
                                    var acceptBtn = "<a href=\"javascript:void(0);\" id=\"btn-accept\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block" + 
				                                    	(order.state == 2 ? "\">接 受" : " disabled-btn\">已接受") + 
				                                    	"</a>",
				                        refuseBtn = "<a href=\"javascript:void(0);\" id=\"btn-refuse\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block" + 
		                                    			(order.state == 2 ? "\">" : " disabled-btn\">") + "拒 绝</a>"
				                    
                                    i_HTML += (order.state == 1 ? '</div>' : acceptBtn + refuseBtn + '</div>');
                                    var ul = document.createElement('ul');
                                    ul.className = "my-mui-table-view mui-table-view";
                                    ul.innerHTML = i_HTML;
                                    document.querySelector('.mui-content').appendChild(ul);
                                    cuidanControl();
                                } else {
                                    i_HTML = "<li class=\"mui-table-view-cell\"><div class=\"my-cell-title\">工单回复</div><div class=\"my-cell-paragraph\">" + "暂无回复" + "</div></li><!-- 按钮组 --><div class=\"btn-bottom\"><a href=\"#bottomCuidan\" id=\"btn-cuidan\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block\">催单</a><a href=\"#bottomHuifu\" id=\"btn-huifu\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block\">回复</a>";
                                    i_HTML += "<a href=\"javascript:void(0);\" id=\"btn-fenpei\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block" + (order.state > 1 ? " disabled-btn\">已分配" : "\">分配任务") + "</a>";
                                    var acceptBtn = "<a href=\"javascript:void(0);\" id=\"btn-accept\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block" + 
				                                    	(order.state == 2 ? "\">接 受" : " disabled-btn\">已接受") + 
				                                    	"</a>",
				                        refuseBtn = "<a href=\"javascript:void(0);\" id=\"btn-refuse\" class=\"my-block-btn mui-btn mui-btn-primary mui-btn-block" + 
		                                    			(order.state == 2 ? "\">" : " disabled-btn\">") + "拒 绝</a>"
				                    
                                    i_HTML += (order.state == 1 ? '</div>' : acceptBtn + refuseBtn + '</div>');
                                    var ul = document.createElement('ul');
                                    ul.className = "mui-table-view";
                                    ul.innerHTML = i_HTML;
                                    document.querySelector('.mui-content').appendChild(ul);
                                    cuidanControl();
                                }


                            },
                            error: function(data) {
                                mui.toast('网络加载错误', {
                                    duration: 'short',
                                    type: 'div'
                                });
                            }
                        })
                    },
                    error: function(err) {
                        mui.toast('网络加载错误', {
                            duration: 'short',
                            type: 'div'
                        });
                    }
                })

                /*图片上传*/
                var preview = document.getElementById('preview');

                document.getElementById("upload-target").addEventListener("tap", function() {
                    files = [];
                    showActionSheet(); //拍照还是相册
                });
                document.getElementById("upload-submit").addEventListener("tap", function() {
                    upload(); //上传文件
                });
                plus.nativeUI.closeWaiting();


                /*图片上传*/

            })
        })(mui);

        // 中文判断
        function isChinese(text) {
            var reg = new RegExp("[\\u4E00-\\u9FFF]+", "g");
            if (reg.test(text)) {
                return true;
            } else {
                return false;
            }
        }

        // 图片上传POST部分
        var f1 = null;
        var picarr = new Array();
        var basearr = new Array();
        var lat = "",
            longt = "";

        var files = [];

        function cuidanControl() {
            /*催单位置确定*/
            var btnCuidan = document.getElementById("btn-cuidan");
            var btnHuifu = document.getElementById("btn-huifu");
            var btnFenpei = document.getElementById("btn-fenpei");
            var btnAccept = document.getElementById("btn-accept");
            var btnRefuse = document.getElementById("btn-refuse");
            var mask = document.getElementById("mask");
            var title = document.getElementById("section-title");
            var cuiPost = document.getElementById("upload-submit");
            var cuidan = document.getElementById("section-cuidan");
            // var fileImage = document.getElementById("fileImage");
            // 催单发送
            btnCuidan.addEventListener('tap', function(e) {
                    var bodyHeight = document.body.offsetHeight; // 当前body的height
                    mask.style.height = bodyHeight + 'px';
                    title.innerText = "催单";
                    cuidan.style.display = "block";
                    mask.style.display = "block";
                    if (cuidan.style.display === "block") {
                        mask.addEventListener("tap", function(e) {
                            cuidan.style.display = "none";
                            mask.style.display = "none";
                            $("#textarea").val("");
                            files = [];
                            document.getElementById("preview").innerHTML = "<span class='mask-img temp'></span><span class='mask-img temp'></span><span class='mask-img temp'></span>";
                        });
                    }
                })
            // 回复发送
            btnHuifu.addEventListener('tap', function(e) {
                    var bodyHeight = document.body.offsetHeight; // 当前body的height
                    var huifu = document.getElementById("section-cuidan");
                    mask.style.height = bodyHeight + 'px';
                    title.innerText = "回复";
                    huifu.style.display = "block";
                    mask.style.display = "block";
                    if (huifu.style.display === "block") {
                        mask.addEventListener("tap", function(e) {
                            huifu.style.display = "none";
                            mask.style.display = "none";
                            $("#textarea").val("");
                            files = [];
                            document.getElementById("preview").innerHTML = "<span class='mask-img temp'></span><span class='mask-img temp'></span><span class='mask-img temp'></span>";
                        })
                    }
                })
                /*催单位置确定*/
               if(order.state == 1) {
               		btnFenpei.addEventListener("tap", function () {
	               		mui.openWindow({
	               			url: "../engineers/chooseEngineers.html",
	               			extras: {
	               				sid: order.id
	               			}
	               		});
	               }, false);
               }
               
               if(order.state == 2) {
               		var urlPrefix = "https://bird.ioliu.cn/v1?url=";
               		btnAccept.addEventListener("tap", function() {
               			mui.confirm("您确定要接受此维修任务吗？", "接受任务", ['否', '是'], function(e) {
               				if(e.index == 1) {
               					mui.ajax({
               						url: urlPrefix + 'http://hospital.xiaoweicanting.com/factory.php?m=App&c=orders&a=adoptOrder&factoryid=' + order.factoryId + '&workerid=' + order.workerId + '&sid=' + order.id + '&uid=3&token=dfaf',
               						type: 'get',
               						dataType: 'json',
               						async: true,
               						success: function(response) {
               							if(response.state === 'success') {
               								mui.toast("接受任务成功！")
               								setTimeout(function() {
               									mui.openWindow({
               										url: 'order.html'
               									})
               								}, 500)
               							}
               						}
               					})
               				}
               			})
               		}, false);
               		btnRefuse.addEventListener("tap", function() {
               			var bodyHeight = document.body.offsetHeight; // 当前body的height
                    		mask.style.height = bodyHeight + 'px';
                    		
                    		var refusePopup = document.getElementById("section-refuse")
                    		refusePopup.style.display = "block";
                    		mask.style.display = "block";
                    		
                    		var refuseReason = $('#refuse-reason'), 
                    			submitBtn = document.getElementById('refuse-order-submit')
                    		var handleRefuseOrder = function () {
                    			mui.ajax({
                    				url: 'http://hospital.xiaoweicanting.com/factory.php?m=App&c=orders&a=rejectOrder',
                    				type: 'post',
                    				dataType: 'json',
                    				data: {
                    					factoryid: order.factoryId,
                    					workerid: order.workerId,
                    					sid: order.id,
                    					username: order.workername,
                    					content: refuseReason[0].value,
                    					userid: 3,
                    					token: 'dfaf'
                    				},
                    				async: true,
                    				success: function(response) {
                    					if(response.state === 'success') {
                    						mui.toast("操作成功！")
                    						setTimeout(function() {
                    							mui.openWindow({
	                    							url: 'order.html'
	                    						})
                    						}, 500)
                    					}
                    				}
                    			})
                    			
                    		}
                    		submitBtn.addEventListener('tap', handleRefuseOrder, false)
                    		
                    		mask.addEventListener("tap", function(e) {
                            refusePopup.style.display = "none";
                            mask.style.display = "none";
                            
                            refuseReason.val("");
                            submitBtn.removeEventListener('tap', handleRefuseOrder)
                       })
               		}, false);
               }
        }

        // 上传文件
        function upload() {
            var wt = plus.nativeUI.showWaiting();
            var task = plus.uploader.createUpload("http://app.xiaoweicanting.com/hospital.php?m=App&c=orders&a=addReply", {
                    method: "POST"
                },
                function(t, status) { //上传完成
                    if (status == 200) {
                        //						console.log("上传成功：" + t.responseText);
                        console.log("responseText:" + t.responseText);
                        mui.toast("回复成功");
                        mui.ajax("https://bird.ioliu.cn/v1?url=http://app.xiaoweicanting.com/hospital.php?m=App&c=orders&a=getReplyListByOrderId&hospitalid=10&departmentid=11&uid=3&token=dfaf&orderid=" + order.id, {
                                dataType: 'json',
                                type: 'get',
                                success: function(data) {
                                    var replyList = data.data;
                                    var newReply = replyList[replyList.length - 1];
                                    var innerNode = document.createElement('div');
                                    innerNode.className = "my-cell-row-2";

                                    var character = newReply.state == 1 ? "answer-side" : "ask-side";
                                    // 详情图片集合
                                    var picSet, imgHTML;
                                    if (newReply.hasPic == 1) {
                                        picSet = newReply.pics;
                                        imgHTML = '';
                                        for (var j = 0; j < picSet.length; j++) {
                                            imgHTML += "<div class=\"slide-item\"><a><img class=\"my-sm-img\" data-preview-src=\"\" data-preview-group=\"1\" style=\"height: 100%; width: 100%;\" src=\"http://app.xiaoweicanting.com/" + picSet[j] + " \" alt=\"\"></a></div>"
                                        }
                                        imgHTML = "<div class=\"slide-box\">" + imgHTML + "</div>";
                                    } else {
                                        picSet = '';
                                        imgHTML = '';
                                    }

                                    innerNode.innerHTML = "<div class=\"timeline " + character + "\"></div><div class=\"my-reply\"><div class=\"\">" + newReply.content + "</div>" + imgHTML + "<div class=\"my-cell-time\"><i class=\"icon-font\"></i>" + newReply.addtime + "</div></div>"
                                    $('.my-reply-wrapper').append(innerNode);

                                },
                                error: function(data) {
                                    mui.toast('网络加载错误', {
                                        duration: 'short',
                                        type: 'div'
                                    });
                                }
                            })
                            //插入本地数据库
                        wt.close();
                        $("#textarea").val("");
                        $("#section-cuidan").css("display", "none");
                        $("#mask").css("display", "none");
                        files = [];
                        // mui.back();
                    } else {
                        console.log("上传失败：" + status);
                        wt.close();
                    }
                }
            );

            var content = document.getElementById("textarea").value;
            if (content.length < 1) {
                wt.close();
                mui.toast("内容不能为空");
            } else if (content.length > 200) {
                wt.close();
                mui.toast("输入内容不得超过200字");
            } else {

                task.addData("userid", '3');
                task.addData("content", content);
                task.addData("orderid", order.id);
                task.addData("replytype", '1');

                var urge = document.getElementById("section-title").innerText == "催单" ? "1" : "0";
                task.addData("urge", urge);

                if (files.length > 0) {
                    console.log("准备上传" + files.length + "个图片");
                    for (var i = 0; i < files.length; i++) {
                        var f = files[i];
                        console.log("准备上传的图片路径：" + f.path);
                        task.addFile(f.path, {
                            key: f.key
                        });
                    }
                }
                task.start();
            }
        }

        // 添加文件
        var index = 1;
        var newUrlAfterCompress;

        function appendFile(url) {
            files.push({
                key: "uploadkey" + index, //这个值服务器会用到，作为file的key
                path: url
            });
            index++;
        }

        // 产生一个随机数
        function getUid() {
            return Math.floor(Math.random() * 100000000 + 10000000).toString();
        }

        function galleryImgs() { // 从相册中选择图片
            plus.gallery.pick(function(e) {
                $("#preview .temp").remove();

                console.log("选择了" + e.files.length + "个图片");

                for (var i = 0; i < e.files.length; i++) {
                    // if (i < 3) {
                    picarr[i] = e.files[i];
                    $("#preview").prepend("<span class='mask-img'><img src='" + e.files[i] + "' /></span>");
                    var dstname = "_doc/" + getUid() + ".jpg"; //设置压缩后图片的路径
                    compressImage(e.files[i], dstname);
                    // }
                }
            }, function(e) {
                console.log("取消选择图片");
            }, {
                filter: "image",
                multiple: true,
                maximum: 3,
                system: false
            });
        }
        //拍照
        function getImage() {
            var cmr = plus.camera.getCamera();
            cmr.captureImage(function(p) {
                plus.io.resolveLocalFileSystemURL(p, function(entry) {
                    var localurl = entry.toLocalURL(); // 当前图片路径
                    var dstname = "_doc/" + getUid() + ".jpg"; // 设置压缩后图片的路径
                    compressImage(localurl, dstname);
                    $("#preview .temp").remove();
                    $("#preview").prepend("<span class='mask-img'><img src='" + localurl + "' /></span>");
                });
            });
        }
        //压缩图片，这个比较变态的方法，无法return
        function compressImage(src, dstname) {
            //var dstname="_downloads/"+getUid()+".jpg";
            plus.zip.compressImage({
                    src: src,
                    dst: dstname,
                    overwrite: true,
                    quality: 20
                },
                function(event) {
                    console.log("Compress success:" + event.target);
                    appendFile(event.target);
                    // return event.target;
                },
                function(error) {
                    console.log(error);
                    return src;
                    //alert("Compress error!");
                });

        }

        function showActionSheet() {
            var bts = [{
                title: "拍照"
            }, {
                title: "从相册选择"
            }];
            plus.nativeUI.actionSheet({
                    cancel: "取消",
                    buttons: bts
                },
                function(e) {
                    if (e.index == 1) {
                        getImage();
                    } else if (e.index == 2) {
                        galleryImgs();
                    }
                }
            );
        }
        
    </script>
</body>

</html>